﻿
<html>

<head>
<title>1st December 2010</title>


<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
	
<script type="text/javascript" src="jquery-1.3.2.js"></script>

<script type="text/javascript" src="trace.js"></script>

<script type="text/javascript" src="dataStructure.js"></script>
<script type="text/javascript" src="orienteering.js"></script>

<script type="text/javascript" src="control.js"></script>
	
<script type="text/javascript" src="canvas.js"></script>


<script type="text/javascript">


	
function exportAsPNG(event)
{
    var element = document.getElementById('canvas1');
    var strData = element.toDataURL("image/png");
	window.open(strData);
}

function loadData(event)
{
    deleteAll();
    decodeData($('#data').val());
    reset();
    
    markAllPointsAsNeedingRender();
    render();
}


function zoomAndPrint(event)
{
    zoomIn();
    window.print();
}

        
function zoomIn(event)
{
        $('#canvas1').height(HEIGHT);
        $('#canvas1').width(WIDTH);
}        
function zoomOut(event)
{
        var fraction = 300 / HEIGHT;
        $('#canvas1').height(300);
        $('#canvas1').width(fraction * WIDTH);
}


function loadBackgroundImage(event)
{
    var v = $('#imageLocation').val();  
    
    var img = new Image();  
    img.onload = function()
    {  
		canvasSetSize(img.width, img.height)
		
		canvasSetBackgroundImage(img);
		
        zoomOut();
		
        markAllPointsAsNeedingRender();
        render();
    }  
    img.src = v;
	
	trace("loadBackgroundImage from "+v);
    
}

// function setLineScale(event)
// {
//      
//     var v = parseFloat($('#lineScale').val()); 
//     
//         markAllPointsAsNeedingRender();
//         POINTRADIUS = 30 * v;
//         LINEWIDTH = 6 * v;
//         render();
//         
//  trace("setLineScale to "+v);
//     
// }


function setDrawingOperation(event)
{
    var value = $('input[name=group1]:checked').val() 
    
    setFunction(value);
}


	function main(event) {
				
		if (controlInitialise())
		{
				
			        trace("finished controlInitialise");
			if (canvasInitialise('canvas1'))
			{
			        trace("finished canvasInitialise");
			
			        setTargetForRender(C2D)
                    setDataCallback(function(s)
                    {
                        $('#data').val(s)
                    })
                    setResetCallback(function()
                    {
		                calculateSiteStylesAndIndexes(false)
                    })
                    
			        loadBackgroundImage();
			       // setLineScale();
			        setDrawingOperation();
			        loadData();
			        
			        //relaxC();
			        
			        
    				$('#error').hide();
			}
		}
		
	}

		
</script>


</head>



<!--http://www.attackpoint.org/discussionthread.jsp/message_4488-->
<!--[if IE]><script type="text/javascript"
src="/path/to/excanvas.js"></script><![endif]-->


<body onload="main(event)" onkeydown="keyFunctionChosen(event)">
	
	    
<div class="noprint">
	Universal course held on Dec 1st 2010. Extended dog-bones format without any control numbers.
</div>
	
	
<div class="noprint">
	<p id="error">
	Route Designer requires JavaScript and HTML Canvas provided by recent versions of <a href="http://www.apple.com/safari/">Safari</a>, <a href="http://www.mozilla.com/firefox/">Firefox</a>, <a href="http://www.google.com/chrome">Chrome</a> or <a href="http://www.opera.com/index.dml">Opera</a></p>
</div>


<canvas id="canvas1" onmousedown="controlMouseDown(event)" onmousemove="controlMouseMove(event)" onmouseup="controlMouseUp(event)">
</canvas>

<div class="noprint">
<input type="button" onclick="zoomIn(event)" value="Zoom In"/>
<input type="button" onclick="zoomOut(event)" value="Zoom Out"/>
<input type="button" onclick="zoomAndPrint(event)" value="Print"/>
<input type="button" onclick="exportAsPNG(event)" value="Export PNG"/><br>
</div>


<div class="noprint">
<br>
<label>Map Image:<input type="text" id="imageLocation" value="stanley_park_sprint.gif"/></label><br>
<label>Diagram data:<input type="text" id="data" value="e[125]=new Object();e[125].type='VectorObject';e[125].v0='498';e[125].v1='1490';e[126]=new Object();e[126].type='Point';e[126].v0='125';e[127]=new Object();e[127].type='StringObject';e[127].v0='';e[128]=new Object();e[128].type='Text';e[128].v0='127';e[128].v1='126';e[129]=new Object();e[129].type='Site';e[129].v0='128';e[130]=new Object();e[130].type='VectorObject';e[130].v0='625';e[130].v1='1491';e[131]=new Object();e[131].type='Point';e[131].v0='130';e[132]=new Object();e[132].type='StringObject';e[132].v0='';e[133]=new Object();e[133].type='Text';e[133].v0='132';e[133].v1='131';e[134]=new Object();e[134].type='Site';e[134].v0='133';e[140]=new Object();e[140].type='VectorObject';e[140].v0='341';e[140].v1='873';e[141]=new Object();e[141].type='Point';e[141].v0='140';e[142]=new Object();e[142].type='StringObject';e[142].v0='';e[143]=new Object();e[143].type='Text';e[143].v0='142';e[143].v1='141';e[144]=new Object();e[144].type='Site';e[144].v0='143';e[145]=new Object();e[145].type='VectorObject';e[145].v0='73';e[145].v1='1083';e[146]=new Object();e[146].type='Point';e[146].v0='145';e[147]=new Object();e[147].type='StringObject';e[147].v0='';e[148]=new Object();e[148].type='Text';e[148].v0='147';e[148].v1='146';e[149]=new Object();e[149].type='Site';e[149].v0='148';e[160]=new Object();e[160].type='VectorObject';e[160].v0='811';e[160].v1='1430';e[161]=new Object();e[161].type='Point';e[161].v0='160';e[162]=new Object();e[162].type='StringObject';e[162].v0='';e[163]=new Object();e[163].type='Text';e[163].v0='162';e[163].v1='161';e[164]=new Object();e[164].type='Site';e[164].v0='163';e[165]=new Object();e[165].type='VectorObject';e[165].v0='672';e[165].v1='1366';e[166]=new Object();e[166].type='Point';e[166].v0='165';e[167]=new Object();e[167].type='StringObject';e[167].v0='';e[168]=new Object();e[168].type='Text';e[168].v0='167';e[168].v1='166';e[169]=new Object();e[169].type='Site';e[169].v0='168';e[170]=new Object();e[170].type='VectorObject';e[170].v0='834';e[170].v1='1197';e[171]=new Object();e[171].type='Point';e[171].v0='170';e[172]=new Object();e[172].type='StringObject';e[172].v0='';e[173]=new Object();e[173].type='Text';e[173].v0='172';e[173].v1='171';e[174]=new Object();e[174].type='Site';e[174].v0='173';e[175]=new Object();e[175].type='VectorObject';e[175].v0='969';e[175].v1='1270';e[176]=new Object();e[176].type='Point';e[176].v0='175';e[177]=new Object();e[177].type='StringObject';e[177].v0='';e[178]=new Object();e[178].type='Text';e[178].v0='177';e[178].v1='176';e[179]=new Object();e[179].type='Site';e[179].v0='178';e[180]=new Object();e[180].type='VectorObject';e[180].v0='926.0000000000001';e[180].v1='1063';e[181]=new Object();e[181].type='Point';e[181].v0='180';e[182]=new Object();e[182].type='StringObject';e[182].v0='';e[183]=new Object();e[183].type='Text';e[183].v0='182';e[183].v1='181';e[184]=new Object();e[184].type='Site';e[184].v0='183';e[185]=new Object();e[185].type='VectorObject';e[185].v0='1045.0000000000002';e[185].v1='941.9999999999999';e[186]=new Object();e[186].type='Point';e[186].v0='185';e[187]=new Object();e[187].type='StringObject';e[187].v0='';e[188]=new Object();e[188].type='Text';e[188].v0='187';e[188].v1='186';e[189]=new Object();e[189].type='Site';e[189].v0='188';e[190]=new Object();e[190].type='VectorObject';e[190].v0='816';e[190].v1='981';e[191]=new Object();e[191].type='Point';e[191].v0='190';e[192]=new Object();e[192].type='StringObject';e[192].v0='';e[193]=new Object();e[193].type='Text';e[193].v0='192';e[193].v1='191';e[194]=new Object();e[194].type='Site';e[194].v0='193';e[195]=new Object();e[195].type='VectorObject';e[195].v0='818';e[195].v1='909.9999999999999';e[196]=new Object();e[196].type='Point';e[196].v0='195';e[197]=new Object();e[197].type='StringObject';e[197].v0='';e[198]=new Object();e[198].type='Text';e[198].v0='197';e[198].v1='196';e[199]=new Object();e[199].type='Site';e[199].v0='198';e[200]=new Object();e[200].type='VectorObject';e[200].v0='635';e[200].v1='952';e[201]=new Object();e[201].type='Point';e[201].v0='200';e[202]=new Object();e[202].type='StringObject';e[202].v0='';e[203]=new Object();e[203].type='Text';e[203].v0='202';e[203].v1='201';e[204]=new Object();e[204].type='Site';e[204].v0='203';e[205]=new Object();e[205].type='VectorObject';e[205].v0='479.00000000000006';e[205].v1='894';e[206]=new Object();e[206].type='Point';e[206].v0='205';e[207]=new Object();e[207].type='StringObject';e[207].v0='';e[208]=new Object();e[208].type='Text';e[208].v0='207';e[208].v1='206';e[209]=new Object();e[209].type='Site';e[209].v0='208';e[210]=new Object();e[210].type='VectorObject';e[210].v0='638';e[210].v1='860';e[211]=new Object();e[211].type='Point';e[211].v0='210';e[212]=new Object();e[212].type='StringObject';e[212].v0='';e[213]=new Object();e[213].type='Text';e[213].v0='212';e[213].v1='211';e[214]=new Object();e[214].type='Site';e[214].v0='213';e[215]=new Object();e[215].type='VectorObject';e[215].v0='1145';e[215].v1='973';e[216]=new Object();e[216].type='Point';e[216].v0='215';e[217]=new Object();e[217].type='StringObject';e[217].v0='';e[218]=new Object();e[218].type='Text';e[218].v0='217';e[218].v1='216';e[219]=new Object();e[219].type='Site';e[219].v0='218';e[220]=new Object();e[220].type='VectorObject';e[220].v0='1414';e[220].v1='812';e[221]=new Object();e[221].type='Point';e[221].v0='220';e[222]=new Object();e[222].type='StringObject';e[222].v0='';e[223]=new Object();e[223].type='Text';e[223].v0='222';e[223].v1='221';e[224]=new Object();e[224].type='Site';e[224].v0='223';e[225]=new Object();e[225].type='VectorObject';e[225].v0='1437';e[225].v1='656';e[226]=new Object();e[226].type='Point';e[226].v0='225';e[227]=new Object();e[227].type='StringObject';e[227].v0='2';e[228]=new Object();e[228].type='Text';e[228].v0='227';e[228].v1='226';e[229]=new Object();e[229].type='Site';e[229].v0='228';e[230]=new Object();e[230].type='VectorObject';e[230].v0='1510';e[230].v1='645';e[231]=new Object();e[231].type='Point';e[231].v0='230';e[232]=new Object();e[232].type='StringObject';e[232].v0='1';e[233]=new Object();e[233].type='Text';e[233].v0='232';e[233].v1='231';e[234]=new Object();e[234].type='Site';e[234].v0='233';e[235]=new Object();e[235].type='VectorObject';e[235].v0='1550';e[235].v1='390';e[236]=new Object();e[236].type='Point';e[236].v0='235';e[237]=new Object();e[237].type='StringObject';e[237].v0='';e[238]=new Object();e[238].type='Text';e[238].v0='237';e[238].v1='236';e[239]=new Object();e[239].type='Site';e[239].v0='238';e[240]=new Object();e[240].type='VectorObject';e[240].v0='1666';e[240].v1='533';e[241]=new Object();e[241].type='Point';e[241].v0='240';e[242]=new Object();e[242].type='StringObject';e[242].v0='';e[243]=new Object();e[243].type='Text';e[243].v0='242';e[243].v1='241';e[244]=new Object();e[244].type='Site';e[244].v0='243';e[245]=new Object();e[245].type='VectorObject';e[245].v0='1724';e[245].v1='466';e[246]=new Object();e[246].type='Point';e[246].v0='245';e[247]=new Object();e[247].type='StringObject';e[247].v0='1';e[248]=new Object();e[248].type='Text';e[248].v0='247';e[248].v1='246';e[249]=new Object();e[249].type='Site';e[249].v0='248';e[252]=new Object();e[252].type='StringObject';e[252].v0='';e[253]=new Object();e[253].type='Text';e[253].v0='252';e[253].v1='359';e[254]=new Object();e[254].type='Site';e[254].v0='253';e[255]=new Object();e[255].type='VectorObject';e[255].v0='1891.0000000000002';e[255].v1='723';e[256]=new Object();e[256].type='Point';e[256].v0='255';e[257]=new Object();e[257].type='StringObject';e[257].v0='5';e[258]=new Object();e[258].type='Text';e[258].v0='257';e[258].v1='256';e[259]=new Object();e[259].type='Site';e[259].v0='258';e[260]=new Object();e[260].type='VectorObject';e[260].v0='2273';e[260].v1='732';e[261]=new Object();e[261].type='Point';e[261].v0='260';e[262]=new Object();e[262].type='StringObject';e[262].v0='2';e[263]=new Object();e[263].type='Text';e[263].v0='262';e[263].v1='261';e[264]=new Object();e[264].type='Site';e[264].v0='263';e[265]=new Object();e[265].type='VectorObject';e[265].v0='2584';e[265].v1='647';e[266]=new Object();e[266].type='Point';e[266].v0='265';e[267]=new Object();e[267].type='StringObject';e[267].v0='3';e[268]=new Object();e[268].type='Text';e[268].v0='267';e[268].v1='266';e[269]=new Object();e[269].type='Site';e[269].v0='268';e[270]=new Object();e[270].type='VectorObject';e[270].v0='2491';e[270].v1='939';e[271]=new Object();e[271].type='Point';e[271].v0='270';e[272]=new Object();e[272].type='StringObject';e[272].v0='4';e[273]=new Object();e[273].type='Text';e[273].v0='272';e[273].v1='271';e[274]=new Object();e[274].type='Site';e[274].v0='273';e[281]=new Object();e[281].type='VectorObject';e[281].v0='535';e[281].v1='1299';e[282]=new Object();e[282].type='Point';e[282].v0='281';e[283]=new Object();e[283].type='StringObject';e[283].v0='';e[284]=new Object();e[284].type='Text';e[284].v0='283';e[284].v1='282';e[285]=new Object();e[285].type='Site';e[285].v0='284';e[288]=new Object();e[288].type='Line';e[288].v0='282';e[288].v1='131';e[291]=new Object();e[291].type='Line';e[291].v0='131';e[291].v1='126';e[294]=new Object();e[294].type='Line';e[294].v0='126';e[294].v1='141';e[297]=new Object();e[297].type='Line';e[297].v0='141';e[297].v1='146';e[300]=new Object();e[300].type='Line';e[300].v0='211';e[300].v1='206';e[303]=new Object();e[303].type='Line';e[303].v0='206';e[303].v1='201';e[306]=new Object();e[306].type='Line';e[306].v0='201';e[306].v1='191';e[309]=new Object();e[309].type='Line';e[309].v0='191';e[309].v1='186';e[312]=new Object();e[312].type='Line';e[312].v0='196';e[312].v1='186';e[321]=new Object();e[321].type='Line';e[321].v0='216';e[321].v1='176';e[324]=new Object();e[324].type='Line';e[324].v0='176';e[324].v1='161';e[327]=new Object();e[327].type='Line';e[327].v0='161';e[327].v1='166';e[330]=new Object();e[330].type='Line';e[330].v0='166';e[330].v1='171';e[333]=new Object();e[333].type='Line';e[333].v0='171';e[333].v1='181';e[336]=new Object();e[336].type='Line';e[336].v0='226';e[336].v1='236';e[339]=new Object();e[339].type='Line';e[339].v0='226';e[339].v1='231';e[342]=new Object();e[342].type='Line';e[342].v0='231';e[342].v1='221';e[345]=new Object();e[345].type='Line';e[345].v0='241';e[345].v1='246';e[348]=new Object();e[348].type='Line';e[348].v0='246';e[348].v1='261';e[351]=new Object();e[351].type='Line';e[351].v0='261';e[351].v1='266';e[354]=new Object();e[354].type='Line';e[354].v0='266';e[354].v1='271';e[357]=new Object();e[357].type='Line';e[357].v0='271';e[357].v1='256';e[358]=new Object();e[358].type='VectorObject';e[358].v0='1732';e[358].v1='610';e[359]=new Object();e[359].type='Point';e[359].v0='358';e[360]=new Object();e[360].type='Line';e[360].v0='256';e[360].v1='359';"/></label><br>

</div>


<div class="noprint">
	<div id="trace"></div>
</div>


</body>

</html>